<template>
	<div id = "index">
		<!-- nav -->
		<headersCom></headersCom>
		<div class="index-content">
			<div class="index-title">
				<span>情报跟踪</span>
			</div>
			<!-- 搜索框 -->
			<div class="search">
				<input type="text" class="search-input" v-model="searchValue" name="search" placeholder="请输入你想知道的"/>
				<input type="button" class="search-button" value="搜索" @click="searchBut"/>
				<i class="search-icon"></i>
			</div>
			<!-- 路由切换 -->
			<div class="index-router">
				<div class="index-tab">
					<ul>
						<li>
							<router-link to='/index/subscribe'>我的订阅</router-link>
						</li>
						<li>
							<router-link to='/index/navigation'>导航</router-link>
						</li>
						<li>
							<router-link to='/index/recommend'>推荐</router-link>
						</li>
						<li>
							<router-link to='/index/knowledge'>知识管理</router-link>
						</li>
					</ul>
				</div>
				<!-- 路由存放处 -->
				<router-view></router-view>
			</div>
		</div>

	</div>
</template>

<script>
// 头部组件引入
import Header from '@/components/header'
import Footer from '@/components/footer'

export default {
	data () {
		return {
			searchValue: ''
		}
	},
  components: {
    'headersCom': Header,  // 应用头部组件
	'footers': Footer
  },
  methods: {
	searchBut: function () {
	  this.$router.push({
			path: '/searchList/comprehensive',
			query: {
				'searchVal': this.searchValue
			}
		})
	}
  }
}
</script>

<style>
	@import '../../../static/index/index.css'
</style>